<!--templates-->
<div class="animated fadeIn" >
    <div class="row">
        <div class="col-lg-12">
            <div class="card">
                <div class="card-header" th:inline="text">
                    <i class="fa fa-align-justify"></i> [[${pageTitle}]]
                </div>
                <div class="card-body">
                    <div class=" form-horizontal">
                        <fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
                            <legend>用户基本信息</legend>
                        </fieldset>
                        <div class="layui-form-item row">
                            <label class="layui-form-label">用户名</label>
                            <div class="layui-input-block col-md-4">
                                <input type="text" name="key" lay-verify="required" autocomplete="off" placeholder="请输入用户名" class="layui-input" th:field="${sysUser.username}" readonly="true"></input>
                                <input type="hidden" name="id" th:field="${sysUser.id}"></input>
                            </div>
                            <label class="layui-form-label">姓名</label>
                            <div class="layui-input-block col-md-4">
                                <input type="text" name="name" lay-verify="required" autocomplete="off" placeholder="请输入姓名" class="layui-input" th:field="${sysUser.name}" readonly="true"></input>
                            </div>
                        </div>
                        <fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
                            <legend>用户权限信息</legend>
                        </fieldset>
                        <div class="row">
                            <div class="col-md-1">
                            </div>
                            <div class="col-md-10" style="float: right">
                                <div class="row">
                                    <a shiro:hasPermission="sys:role:auth" class="opreate-btn  layui-btn layui-btn-sm" style="margin-left: 20px" id="authbtn" href="#"><i class="icon-plus"></i>权限赋权</a>
                                </div>
                                <table class="layui-table table-responsive-sm" id="roleTable" lay-filter="role"></table>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <!--/.row-->
        </div>
    </div>
</div>

<!--js-->
<script th:inline="javascript">

    /*<![CDATA[*/
    var pageTitle=/*[[${pageTitle}]]*/;//取值
    /*]]>*/

    /*<![CDATA[*/
    var userid=/*[[${sysUser.id}]]*/;//取值
    /*]]>*/

    layui.config({
        base: '../lib/layui/layuiextend/treegrid/'
    }).use(['laytpl', 'treegrid'], function () {

        var laytpl = layui.laytpl,treegrid = layui.treegrid;
        treegrid.config.render = function (viewid, data) {
            var view = document.getElementById(viewid).innerHTML;
            return laytpl(view).render(data) || '';
        };

        getJSON("/api/sys/role/getRoleForPaging")
                .catch( error => {

                }).then( value => {
            debugger;
            var rows=JSON.parse(value);
            checkedtreegrid=treegrid.createNew({
                elem: 'roleTable',
                view: 'roleView',
                data: {rows: rows},
                id: 'id',
                root: "-1",
                parentid: 'parentId',
                singleSelect: false
            });
            checkedtreegrid.build();

            /*<![CDATA[*/
            getJSON("/api/sys/role/getUserRoleForTree?userid="+userid)
                    .catch( error => {

                    }).then( value => {
                var rows=JSON.parse(value);
                var roleids=new Array();
                $.each(rows, function (_, row) {
                    roleids.push(row["id"]);
                });
                checkedtreegrid.selectValue(roleids);
            })
            /*]]>*/

            $('#authbtn').on('click', function(){
                debugger;
                var row =checkedtreegrid.selectRow();
                debugger;
                postJSON("/api/sys/user/roleauth",{"sysRoles":row,"userid":userid})
                        .catch(error => {

                        })
                        .then(value =>{
                            if(value==undefined) {
                                layer.alert(pageTitle+"失败!", {icon: 2});
                            }else{
                                var result=JSON.parse(value);
                                if (result == true) {
                                    layer.alert( pageTitle+'成功!',{
                                        icon: 6
                                        ,btn: ['确认']
                                        ,yes: function(index) {
                                            layer.close(index);
                                            getJSON("/api/sys/role/getRoleForPaging")
                                                    .catch( error => {

                                                    }).then( value => {
                                                debugger;
                                                var rows=JSON.parse(value);
                                                checkedtreegrid=treegrid.createNew({
                                                    elem: 'roleTable',
                                                    view: 'roleView',
                                                    data: {rows: rows},
                                                    id: 'id',
                                                    root: "-1",
                                                    parentid: 'parentId',
                                                    singleSelect: false
                                                });
                                                checkedtreegrid.build();

                                                /*<![CDATA[*/
                                                getJSON("/api/sys/role/getUserRoleForTree?userid="+userid)
                                                        .catch( error => {

                                                        }).then( value => {
                                                    var rows=JSON.parse(value);
                                                    var roleids=new Array();
                                                    $.each(rows, function (_, row) {
                                                        roleids.push(row["id"]);
                                                    });
                                                    checkedtreegrid.selectValue(roleids);
                                                })
                                                /*]]>*/
                                            })
                                        }
                                    });
                                } else {
                                    layer.alert(pageTitle+"失败!", {icon: 2});
                                }
                            }
                        });

            });


        })

    })
</script>

<!--模板 js start-->
<script id="roleView" type="text/html">
    <table class="layui-table">
        <thead>
        <tr>
            <th>权限代码</th>
            <th>权限名称</th>
            <th>权限描述</th>
        </tr>
        </thead>
        <tbody>
        {{# layui.each(d.rows,function(index,r){ }}
        <tr>
            <td><input type="checkbox" />{{r.key}}</td>
            <td>{{r.name}}</td>
            <td>{{r.description}}</td>
        </tr>
        {{# }); }}
        </tbody>
    </table>
</script>
<!--模板 end-->

<!--css-->
<style type="text/css">

</style>